import React from 'react';
import constant from '@/const';
import CreateForm from '@/components/CreateForm';
import { Tag } from 'antd';
import _ from 'lodash';

export const getFormData = (that: any) => {
  const { submitLoading, exportLoading, userLevelList } = that.state;
  const formConfig = {
    submitLoading,
    exportLoading,
    config: [
      {
        id: 'date',
        type: 'daterange',
        options: {
          name: '选择日期',
          showTime: true,
          value: that.initDefaultDateByMonths(1),
          // allowClear: false,
          format: ['startTime', 'endTime'],
        },
      },
      {
        id: 'maxAmount',
        type: 'input-number',
        options: {
          name: '',
          width: 80,
          hidden: true,
          placeholder: '请输入',
          value: '',
        },
      },
      {
        id: 'minAmount',
        type: 'input-number',
        options: {
          name: '',
          width: 80,
          hidden: true,
          placeholder: '请输入',
          value: '',
        },
      },
      {
        id: 'input-number-group',
        type: 'input-number-group',
        options: {
          name: '提现金额',
          value: '',
          prev: 'minAmount',
          next: 'maxAmount',
        },
      },
      {
        id: 'userType',
        type: 'select',
        options: {
          name: '账户类型',
          placeholder: '请选择账户类型',
          value: 0,
          allowClear: false,
          list: constant.ACCOUNT_TYPE.filter(item => item.value !== -1) || [],
        },
      },
      {
        id: 'searchType',
        type: 'select',
        options: {
          name: '',
          width: 115,
          placeholder: '',
          value: 2,
          hidden: true,
          allowClear: false,
          list: constant.RISK_SEARCH_TYPE,
        },
      },
      {
        id: 'keywords',
        type: 'input',
        options: {
          name: '',
          value: '',
          width: 260,
          placeholder: '请输入',
          addonBefore: 'searchType',
        },
      },
      {
        id: 'clientType',
        type: 'select',
        options: {
          name: '操作端口',
          placeholder: '请选择操作端口',
          value: '|',
          allowClear: false,
          list: constant.DEVICE_TYPE,
        },
      },
      {
        id: 'status',
        type: 'select',
        options: {
          name: '审核状态',
          placeholder: '请选择审核状态',
          value: -3,
          allowClear: false,
          list: constant.WITHDRAW_STATUS,
        },
      },
      {
        id: 'riskType',
        type: 'select',
        options: {
          name: '风险类型',
          placeholder: '请选择风险类型',
          value: [],
          allowClear: false,
          list: constant.RISK_TYPES.filter(i => i.value !== -1),
          format: (list: any[]) => list.join(','),
        },
        config: {
          mode: 'multiple',
        },
      },
      {
        id: 'userLevel',
        type: 'select',
        options: {
          name: '用户层级',
          placeholder: '请选择用户层级',
          value: [],
          allowClear: false,
          list: userLevelList,
          format: (list: any[]) => list.join(','),
        },
        config: {
          mode: 'multiple',
        },
      },
      {
        id: 'dateType',
        type: 'input',
        options: {
          value: 1,
          hidden: true,
        },
      },
      {
        id: 'submit',
        type: 'button',
        options: {
          name: '查询',
          type: 'primary',
        },
      },
      {
        id: 'reset',
        type: 'button',
        options: {
          name: '重置',
        },
      },
    ],
    requestList: that.requestList,
  };
  // 此处保存表单最初的默认值
  that.initDefaultFormParams({ formConfig });
  return formConfig;
};

// 公用头
const header = (that: any) => {
  const { visible } = that.state;
  return [
    {
      title: '操作',
      dataIndex: 'operates',
      hidden: visible,
      width: 160,
      render: (text: number, row: any) => {
        if (row.status !== -3 && row.status !== -4) {
          return (
            <Tag
              color="green"
              style={{ cursor: 'pointer', margin: 0 }}
              onClick={() => that.handleReviewInfo(row, true)}
            >
              查看
            </Tag>
          );
        }
        return (
          <Tag
            color="orange"
            style={{ cursor: 'pointer', margin: 0 }}
            onClick={() => that.handleReviewInfo(row, false)}
          >
            审核
          </Tag>
        );
      },
    },
    {
      title: '提现时间',
      dataIndex: 'createDate',
      formatTimeStamp: true,
    },
    {
      title: '提现单号',
      dataIndex: 'orderId',
    },
    {
      title: '账户号',
      dataIndex: 'username',
    },
    {
      title: '提现金额',
      dataIndex: 'amount',
      formatAmount: true,
    },
    {
      title: '账户类型',
      dataIndex: 'userType',
      render: (text: number) => {
        const data = constant.ACCOUNT_TYPE.filter(i => i.value === text);
        return data.length ? data[0].label : '--';
      },
    },
    {
      title: '用户层级',
      dataIndex: 'userLevelName',
    },
    {
      title: '操作端',
      dataIndex: 'clientType',
      render: (text: number) => {
        const data = constant.DEVICE_TYPE.filter(i => i.value === text);
        return data.length ? data[0].label : '--';
      },
    },
    {
      title: '风险类型',
      dataIndex: 'riskType',
      render: (text: number) => {
        const data = constant.RISK_TYPES.filter(i => i.value === text);
        return data.length ? data[0].label : '--';
      },
    },
    {
      title: '审核状态',
      dataIndex: 'status',
      width: 180,
      render: (text: number) => {
        const data = constant.WITHDRAW_EXCEPTION_STATUS.filter(i => i.value === text);
        return data.length ? data[0].label : '--';
      },
    },
    {
      title: '提现银行',
      dataIndex: 'bankName',
    },
  ];
};

export const getTableData = (that: any) => {
  const { pagination, loading, selectedRowKeys, list, optType } = that.state;
  return {
    pagination,
    loading,
    changePaginationCallBack: (param: any) => that.updatePagination(param, that.requestList),
    data: list || [],
    tableTitle: () => (
      <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
        <CreateForm
          formConfig={{
            style: { paddingBottom: '8px' },
            noDrawer: true,
            config: [
              {
                id: 'optType',
                type: 'select',
                options: {
                  name: '批量操作',
                  placeholder: '请选择',
                  value: optType,
                  allowClear: false,
                  list: constant.MEMBER_REVIEW_CHECK_TYPE,
                },
              },
              {
                id: 'submit',
                type: 'button',
                options: {
                  name: '执行',
                  type: 'primary',
                  auth: true,
                },
              },
            ],
            requestList: that.handleOperate,
          }}
        />
      </div>
    ),
    bindKey: 'orderId',
    rowSelection: {
      selectedRowKeys,
      hideDefaultSelections: true,
      getCheckboxProps: (row: any) => ({ disabled: row.status !== -3 && row.status !== -4 }),
      onChange: (selectedRowKey: any) => that.changeState({ selectedRowKeys: selectedRowKey }),
    },
    header: _.cloneDeep(header(that)),
  };
};

export const getModalData = (that: any) => {
  const {
    visible,
    optType,
    singleOptType,
    dataCenter,
    reviewLoading,
    step,
    selectedRowKeys,
    rejectReasonList,
  } = that.state;
  // const { validator } = that.props;

  let footer = [
    {
      id: 'reset',
      name: '取消',
      auth: true,
      default: 'button',
      type: 'default',
      event: {
        click: that.handleCancel,
      },
    },
  ];
  constant.MEMBER_REVIEW_CHECK_TYPE.forEach(item => {
    const getFooter = (): void => {
      // @ts-ignore
      footer = [].concat(footer, [
        {
          id: 'submit',
          name: item.label,
          auth: true,
          default: 'button',
          loading: reviewLoading,
          style: { background: item.color, borderColor: item.color },
          event: {
            click: that.handleBatchReview,
          },
        },
      ]);
    };
    if (step === 1 && item.value === optType) {
      getFooter();
    }
    if (step === 2 && item.value === singleOptType) {
      getFooter();
    }
  });

  const tableConfig =
    step === 2
      ? {}
      : {
          height: 400,
          loading: dataCenter.loading,
          // pagination: dataCenter,
          changePaginationCallBack: (param: any) => that.updateDataCenter(param),
          data: dataCenter.list,
          header: _.cloneDeep(header(that)),
          bindKey: 'orderId',
          rowSelection: {
            selectedRowKeys,
            hideDefaultSelections: true,
            getCheckboxProps: (row: any) => ({ disabled: row.status !== -3 && row.status !== -4 }),
            onChange: (selectedRowKey: any) =>
              that.changeState({ selectedRowKeys: selectedRowKey }),
          },
        };

  const hidden = step === 1 ? optType !== 2 : singleOptType !== 2;
  const formItemLayout = !hidden
    ? {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 2 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 22 },
        },
      }
    : {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 0 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 24 },
        },
      };
  return {
    visible,
    width: 1000,
    title: '请输入审核备注',
    closeModalCallBack: that.handleCancel,
    formConfig: {
      formItemLayout,
      config: [
        {
          id: 'rejectReason',
          type: 'select',
          options: {
            name: '理由',
            placeholder: '请选择理由',
            value: '',
            list: rejectReasonList,
            hidden,
          },
        },
        {
          id: 'remark',
          type: 'textarea',
          options: {
            name: '备注',
            value: '',
            placeholder: '请输入审核备注',
          },
        },
      ],
      rules: {
        remark: [
          { required: true, message: '此选项不能为空' },
          { max: 45, message: '不可超过45位字符' },
        ],
        rejectReason: [{ required: true, message: '此选项不能为空' }],
      },
    },
    tableConfig,
    footer,
  };
};
